<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>系统菜单维护</title>
	<meta http-equiv="X-UA-Compatible" content="IE=edge" >
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <script src="${g_path}/js/sys/common.js" type="text/javascript"></script>
	<style type="text/css">
	    body,html {
			width: 100%;
			height: 100%;
			padding: 0px;
			margin: 0px;
			overflow: hidden;
		}    
	</style>  

  </head>
  <body>
  <div id="layout1" class="mini-layout" style="width:100%;height:100%;"  borderStyle="border:solid 1px #aaa;">
        <div title="系统菜单树" showProxyText="true" region="west" width="200" showSplitIcon="true">
            <ul id="tree1" class="mini-tree" url="${g_path}/menu/treeData" style="width:100%; height:100%; padding:5px;" 
                showTreeIcon="true" textField="menuname" idField="id" parentField="pid" resultAsTree="false" expandOnLoad="0" onnodeclick="onNodeSelect">        
            </ul>
        </div>
        <div title="center" region="center">
            <div class="mini-toolbar" style="padding:0px;border-bottom:0;">
                <table style="width:100%;">
                    <tr>
                    <td style="width:100%;">
                        <a class="mini-button" iconCls="icon-add" plain="true" onclick="add();">新增</a>
                        <a class="mini-button" iconCls="icon-remove" plain="true" onclick="del();">删除</a>
                        <span class="separator"></span>
                        <a class="mini-button" iconCls="icon-save" plain="true" onclick="save();">保存</a>
                    	<span class="separator"></span>    
			            <a class="mini-button" iconCls="icon-upload" plain="true" onclick="moveUp()">上移</a> 
			            <a class="mini-button" iconCls="icon-download" plain="true" onclick="moveDown()">下移</a>
			            <span class="separator"></span>
                    	<a class="mini-button" iconCls="icon-edit" plain="true" onclick="roleMenu()">角色菜单</a> 
                    </td>
                    <td style="white-space:nowrap;">
                        <input id="txtKey" class="mini-textbox" emptyText="请输入关键字"  onenter="onSearch()" />
                        <a class="mini-button" iconCls="icon-search" plain="true" onclick="onSearch()">查询</a>
                        </td>
                    </tr>
                </table>
            </div>
            <!--撑满页面-->
            <div class="mini-fit" >
        
                <div id="datagrid1" class="mini-datagrid" style="width:100%;height:100%;" fitColumns="false"
                    url="${g_path}/menu/list"  idField="id" sizeList="[30,50,100,500]" pageSize="50"
                    allowCellEdit="true" allowCellSelect="true" multiSelect="true"
                >
                    <div property="columns">
                        <div type="checkcolumn" ></div>
                        <div type="indexcolumn" ></div>
                        <div field="menuname" width="200" headerAlign="center" align="center" allowSort="false">菜单名称
                            <input property="editor" class="mini-textbox" style="width: 100%;" />
                        </div> 
                        <div field="url" width="200" headerAlign="center" align="center" allowSort="false">打开URL
                            <input property="editor" class="mini-textbox" style="width: 100%;" />
                        </div> 
                        <div field="openway" width="200" headerAlign="center" align="center" allowSort="false">打开方式
                            <input property="editor" class="mini-combobox" style="width:100%;" data="OpenWays" />
                        </div>
                        <div field="px" width="90" headerAlign="center" allowSort="false" align="center">排序  
			                <input property="editor" class="mini-spinner" minValue="0" maxValue="200" value="25" style="width:100%;"/>
			             </div>                                          
                    </div>
                </div> 

            </div>
        </div>
    </div>
</body>
</html>
<script type="text/javascript">
    var OpenWays = [{ id: '属性页', text: '属性页' }, { id: '新窗口', text: '新窗口' }];
    mini.parse();
    var grid = mini.get("datagrid1");
    var tree = mini.get("tree1");
    var nodes = tree.getList();
    if (nodes && nodes.length > 0) {
        tree.selectNode(nodes[0]);
        onSearch();
    }

    function add() {
        var pid = "-1";
        var node = tree.getSelectedNode();
        if (node) {
            pid = node.id;
        }

        var newRow = {};
        newRow["pid"] = pid;
        grid.addRow(newRow);
        grid.scrollIntoView(newRow);
    }

    function del() {
        var rows = grid.getSelecteds();
        if (rows.length < 1) {
            MsgBox.alert("请勾选需要删除的数据！");
            return;
        }
        grid.removeRows(rows);
    }

    function save() {
        grid.commitEdit();
        grid.validate();
        if (grid.isValid() == false) {
            var error = grid.getCellErrors()[0];
            grid.beginEditCell(error.record, error.column);
            return;
        }

        var datas = grid.getChanges(null, true);
        var json = mini.encode(datas);

        var url = "${g_path}/menu/save";
        var re = getJson(url, { data: json }, true, function (re) {
            if (!re.isOk) {
                MsgBox.alert("保存失败！");
            }
            else {
                MsgBox.alert("保存成功！");
                refreshTree();
                onSearch();
            }
        });
    }
	
	function moveUp(){
	}
	
	function moveDown(){
	}
	
    function refreshTree() {
        var node = tree.getSelectedNode();
        tree.reload();
        tree.selectNode(node);
    }

    function onSearch() {
        var pid = "-1";
        var node = tree.getSelectedNode();
        if (node) {
            pid = node.id;
        }

        var param = {
            pid: pid,
            key: mini.get("txtKey").getValue()
        }

        grid.load(param);
    }

    function onNodeSelect() {
        onSearch();
    }
    
    function roleMenu(){
    	var mini = mini;
    	if(window.top.mini)
    		mini = window.top.mini;
    	
    	mini.open({
                    url: "${g_path}/menu/showRoleMenu",
                    title: "角色菜单维护", 
                    width: 800, height: 550,
                    onload: function () {
                        var iframe = this.getIFrameEl();
                    },
                    ondestroy: function (action) {
                    }
                });
    }
</script>
